<template>
  <van-card class="blog-m-info"
  >
    <template #thumb>
      <van-image
        fit="cover"
        round
        width="88"
        height="88"
        :src="info?.avatar"
      />
    </template>
    <template #title>
      <div class="blog-m-info--title">
      <h3>作者: {{ info.nickName }}</h3>
      </div>
    </template>
    <template #desc>
      <div class="blog-m-info--date">
        <van-icon size="16" name="underway-o" />
        <span >{{ info.date }}</span>
    </div>
    </template>
    <template #num>
      <div class="blog-m-btn--article">
      <span class="blog-info--item">
        <van-icon name="star-o" />
        {{ info.likes }}
      </span>
      <span class="blog-info--item">
        <van-icon name="eye-o" /> {{ info.hits }}
      </span>
      <span class="blog-info--item">
        <van-icon name="records-o" /> {{ info.conment_num }}
      </span>
    </div>
    </template>

 
    
  </van-card>
</template>

<script>
export default {
  name: "VueEleMArticleInfo",
  props: {
    info: {
      type: Object,
      default() {
        return {};
      },
    },
  },
  data() {
    return {
      likeNum() {
        return this.info.likes + this.virActive;
      },
    };
  },

  mounted() {},

  methods: {},
};
</script>
<style lang="stylus" 
>
.blog-m-info.van-card
  padding 1em .52em 1.5em
  margin 0 0 1em
  background-color #fff
  border-radius .62em
.blog-m-info--title
  padding 0.22em 0.52em 0
.blog-m-info--date
  display flex
  align-items center
  padding .88em 0.52em 0
  line-height 0.22em
  color #969799
  & .van-icon
    padding 0 0.22em 0.12em 0
.blog-m-btn--article
  padding-bottom 0.52em
  // color
</style>